<template>
  <p>{{ $store.state.modulesA.userName }}</p>
  <!-- 有命名空间时需要这样调用 -->
  <p>{{ $store.getters['modulesA/newName'] }}</p>
  <p>{{ a }}</p>
  <button @click="setUser">修改</button>
</template>

<script>
import { useStore } from 'vuex'
export default {
  setup () {
    const store = useStore()
    // 有命名空间时需要这样掉
    const a = store.getters['modulesA/newName']

    const setUser = () => {
      // 外部调用 actions 的函数时使用 dispatch
      store.dispatch('modulesA/setUser')
    }
    return {
      a,
      setUser
    }
  }
}
</script>

<style scoped></style>
